<template>
  <view class="page_pb min-h-[100vh] pt-20">
    <view v-if="isComplate" class="text-center pt-60">
      <view class="text-base font-bold">绑定成功</view>
      <view class="w-1/3 mt-30 mx-auto py-12 primary_btn text-center text-base rounded" @click="enter">立即进入</view>
    </view>
    <view v-else-if="isError" class="text-center pt-60">
      <view class="text-base font-bold">{{ errorMsg }}</view>
      <view class="mt-30">{{ subErrorMsg }}</view>
    </view>
    <template v-else>
      <DataLoading v-if="loading" />
      <template v-else>
        <view class="text-base font-bold text-center">绑定信息确认</view>
        <view class="px-12 bg-white py-15 mt-10">
          <view class="flex items-center justify-between py-12 border-b border-solid border-[#f4f4f4]">
            <text class="text-font_gray">客户名称</text>
            <text class="ml-10">{{ bindInfo.crm_customer?.company_name || '-' }}</text>
          </view>
          <view class="flex items-center justify-between py-12 border-b border-solid border-[#f4f4f4]">
            <text class="text-font_gray">产品名称</text>
            <text class="ml-10">{{ bindInfo.product?.name || '-' }}</text>
          </view>
          <view class="flex items-center justify-between py-12 border-b border-solid border-[#f4f4f4]">
            <text class="text-font_gray">到期时间</text>
            <text class="ml-10">{{ bindInfo.expiration_time || '-' }}</text>
          </view>
        </view>
        <view class="bottom_fixed_wrapper">
          <view class="w-full py-12 primary_btn text-center text-base rounded" @click="submitBind">确认绑定</view>
        </view>
      </template>
    </template>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { loginByWeappApi, getUserInfoApi, getCustomerInfoApi } from '@/api/user';
import { getBindCustomerInfoApi, bindCustomerApi } from '@/api/common';
import { USER_ACCESS_TOKEN } from '@/libs/config.js';
import { setStorageUserInfo } from '@/utils/utils.js';

const loading = ref(true);
const isComplate = ref(false);
const isError = ref(false);
const bindInfo = ref({});
const errorMsg = ref('识别错误');
const subErrorMsg = ref('请重新扫码');
let sceneKey = '';

onLoad(async ({ scene = '' }) => {
  if (scene) {
    sceneKey = scene;
    if (uni.getStorageSync(USER_ACCESS_TOKEN)) {
      getCustomerInfo();
    } else {
      uni.login({
        success: async res => {
          const { code, data } = await loginByWeappApi({
            code: res.code,
          });
          if (code === 200) {
            uni.setStorageSync(USER_ACCESS_TOKEN, data.token);
            getCustomerInfo();
          }
        },
      });
    }
  } else {
    isError.value = true;
  }
});

async function getCustomerInfo() {
  const { code, message, data } = await getBindCustomerInfoApi({
    scene_key: sceneKey,
  });
  loading.value = false;
  if (code === 200) {
    bindInfo.value = data;
  } else {
    errorMsg.value = message;
    isError.value = true;
  }
}

async function submitBind() {
  const { code, message } = await bindCustomerApi({
    scene_key: sceneKey,
  });
  if (code === 200) {
    const { code: code2, data } = await getUserInfoApi();
    if (code2 == 200) {
      const {
        code: code3,
        data: { list = [] },
      } = await getCustomerInfoApi();
      if (code3 == 200) {
        data.customer_id = list?.[0]?.id ?? '';
        data.expiration_time = list?.[0]?.expiration_time ?? '';
      }
      setStorageUserInfo(data);
    }
    isComplate.value = true;
  } else {
    errorMsg.value = '绑定失败';
    subErrorMsg.value = message;
    isError.value = true;
  }
}
function enter() {
  uni.reLaunch({
    url: '/pages/index/index',
  });
}
</script>
